<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Reveal.js 演示文稿</title>
    <!-- 引入 Reveal.js CSS -->
    <link rel="stylesheet" href="css/reveal.css">
    <!-- 引入主题 CSS -->
    <link rel="stylesheet" href="css/black.css">
    <!-- 引入语法高亮 CSS -->
    <link rel="stylesheet" href="css//monokai.css">
    <!-- 引入 Font Awesome -->
    <link href="css/font-awesome.min.css" rel="stylesheet">
    <!-- 引入 animate.css -->
    <link href="https://cdn.jsdelivr.net/npm/animate.css@4.1.1/animate.min.css" rel="stylesheet">
    <style>
        /* 自定义动画工具类 */
        .reveal-animation {
            animation-duration: 1s;
            animation-fill-mode: both;
        }
        .reveal-delay-100 { animation-delay: 0.1s; }
        .reveal-delay-200 { animation-delay: 0.2s; }
        .reveal-delay-300 { animation-delay: 0.3s; }
        .reveal-delay-400 { animation-delay: 0.4s; }
        .reveal-delay-500 { animation-delay: 0.5s; }
        
        /* 背景缩放动画 */
        @keyframes backgroundScale {
            0%, 100% { transform: scale(1); }
            50% { transform: scale(1.05); }
        }
        
        .reveal {
            animation: backgroundScale 20s ease-in-out infinite;
        }
    </style>
</head>

<body>
    <div class="reveal">
        <div class="slides">


            <!-- 代码高亮示例 -->
            <section>
                <h2 class="animate__animated animate__fadeInDown">代码高亮</h2>
                <p class="animate__animated animate__fadeInUp reveal-delay-200">Reveal.js 支持代码语法高亮显示。</p>
                <pre class="animate__animated animate__fadeInUp reveal-delay-400"><code class="language-java" data-trim data-line-numbers>
def fibonacci(n):
    if n <= 1:
        return n
    else:
        return fibonacci(n-1) + fibonacci(n-2)

# 打印前10个斐波那契数
for i in range(10):
    print(fibonacci(i))
        </code></pre>
            </section>


            <!-- 数学公式幻灯片 -->
            <section>
                <h2 class="animate__animated animate__fadeInDown">数学公式</h2>
                <p class="animate__animated animate__fadeInUp reveal-delay-200 fragment">使用 MathJax 渲染 LaTeX 格式的数学公式：</p>

                <p class="animate__animated animate__fadeInUp reveal-delay-300 fragment">行内公式：\( E = mc^2 \)</p>

                <p class="animate__animated animate__fadeInUp reveal-delay-400 fragment">块级公式：</p>
                \[
                \int_{0}^{\infty} e^{-x^2} dx = \frac{\sqrt{\pi}}{2}
                \]

                <p class="animate__animated animate__fadeInUp reveal-delay-500 fragment">复杂公式：</p>
                \[
                \frac{\partial^2 u}{\partial t^2} = c^2 \left( \frac{\partial^2 u}{\partial x^2} + \frac{\partial^2
                u}{\partial y^2} + \frac{\partial^2 u}{\partial z^2} \right)
                \]
            </section>

            <section>
                <h2 class="animate__animated animate__fadeInDown">矩阵与分式</h2>
                <p class="animate__animated animate__fadeInUp reveal-delay-200 fragment">矩阵表示：</p>
                \[
                A = \begin{bmatrix}
                a_{11} & a_{12} & \cdots & a_{1n} \\
                a_{21} & a_{22} & \cdots & a_{2n} \\
                \vdots & \vdots & \ddots & \vdots \\
                a_{m1} & a_{m2} & \cdots & a_{mn}
                \end{bmatrix}
                \]

                <p class="animate__animated animate__fadeInUp reveal-delay-400 fragment">分式与极限：</p>
                \[
                \lim_{x \to 0} \frac{\sin x}{x} = 1
                \]
            </section>

            <!-- 更多数学公式示例 -->
            <section>
                <h2 class="animate__animated animate__fadeInDown">洛伦兹方程</h2>
                \[
                \begin{aligned}
                \dot{x} & = \sigma(y-x) \\
                \dot{y} & = \rho x - y - xz \\
                \dot{z} & = -\beta z + xy
                \end{aligned}
                \]
                <p class="animate__animated animate__fadeInUp reveal-delay-300 fragment">这些方程描述了大气对流的简化模型，是混沌理论的经典示例。</p>
            </section>

            <section>
                <h2 class="animate__animated animate__fadeInDown">贝塞尔函数</h2>
                \[
                J_{\alpha}(x) = \sum_{m=0}^{\infty} \frac{(-1)^m}{m! \, \Gamma(m+\alpha+1)} {\left( \frac{x}{2}
                \right)}^{2m+\alpha}
                \]
                <p class="animate__animated animate__fadeInUp reveal-delay-300 fragment">贝塞尔函数是数学物理中重要的特殊函数，常用于描述圆柱形系统中的波动现象。</p>
            </section>

            <section>
                <h2 class="animate__animated animate__fadeInDown">傅里叶变换</h2>
                \[
                \mathcal{F}\{f(t)\}(\omega) = \int_{-\infty}^{\infty} f(t) \, e^{-i\omega t} \, dt
                \]
                <p class="animate__animated animate__fadeInUp reveal-delay-300 fragment">傅里叶变换将信号从时域转换到频域，在信号处理和图像处理中有广泛应用。</p>
            </section>

            <section>
                <h2 class="animate__animated animate__fadeInDown">量子力学中的薛定谔方程</h2>
                \[
                i\hbar \frac{\partial}{\partial t} \Psi(\mathbf{r},t) = \left[ -\frac{\hbar^2}{2m} \nabla^2 +
                V(\mathbf{r},t) \right] \Psi(\mathbf{r},t)
                \]
                <p class="animate__animated animate__fadeInUp reveal-delay-300 fragment">薛定谔方程是量子力学的基本方程，描述了量子系统的状态随时间的演化。</p>
            </section>

            <!-- 数学公式配置说明 -->
            <section>
                <h2 class="animate__animated animate__fadeInDown">数学公式配置</h2>
                <p class="animate__animated animate__fadeInUp reveal-delay-200">使用 KaTeX 渲染引擎的配置示例：</p>
                <pre class="animate__animated animate__fadeInUp reveal-delay-400"><code class="language-javascript" data-trim>
Reveal.initialize({
  math: {
    mathjax: 'https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js',
    config: 'TeX-AMS_HTML-full',
    tex2jax: {
      inlineMath: [['$', '$'], ['\\(', '\\)']],
      displayMath: [['$$', '$$'], ['\\[', '\\]']],
      processEscapes: true
    }
  },
  plugins: [RevealHighlight, RevealMarkdown, RevealNotes, RevealMath.KaTeX]
});
        </code></pre>
            </section>

        </div>
    </div>

    <!-- 引入 Reveal.js 核心 JS -->
    <script src="js/reveal.js"></script>
    <!-- 引入插件 JS -->
    <script src="js/highlight.js"></script>
    <script src="js/markdown.js"></script>
    <script src="js/notes.js"></script>
    <!-- 引入 MathJax -->
    <script src="js/tex-mml-chtml.js"></script>

    <script>
        // 初始化 Reveal.js
        Reveal.initialize({
            // 显示当前幻灯片的页数
            slideNumber: true,
            // 启用幻灯片间的过渡效果
            transition: 'slide', // none/fade/slide/convex/concave/zoom
            // 启用键盘导航
            keyboard: true,
            // 启用鼠标滚轮导航
            mouseWheel: true,
            // 启用演讲者模式
            showNotes: false,
            // 自动加载和初始化所有已配置的插件
            plugins: [RevealHighlight, RevealMarkdown, RevealNotes],

            // MathJax 配置
            math: {
                mathjax: 'js/tex-mml-chtml.js',
                config: 'TeX-AMS_HTML-full',
                tex2jax: {
                    inlineMath: [['$', '$'], ['\\(', '\\)']],
                    displayMath: [['$$', '$$'], ['\\[', '\\]']],
                    balanceBraces: true
                }
            },

            // 加载 MathJax 插件
            dependencies: [
                {
                    src: 'js/math.js',
                    async: true
                }
            ]
        });
    </script>
</body>

</html>